//展示框
const all = document.querySelector('.all')
//选项栏
const allChoose = document.querySelector('.allChoose')
// 信息选项
const chooseParent = document.querySelector('.chooseParent')

// 基本信息的DOM对象
const majorInformation = document.querySelector('.majorInformation')
const idNumber = document.querySelectorAll('.idNumber')
const nameInformation = document.querySelectorAll('.name')
const birthday = document.querySelector('.birthday')
const gender = document.querySelector('.gender')
const idCard = document.querySelector('.idCard')
const email = document.querySelector('.email')
const locationName = document.querySelector('.location')

// 学籍信息的DOM对象
const studyInformation = document.querySelector('.studyInformation')

// 其他信息的DOM对象
const elseInformation = document.querySelector('.elseInformation')

// 初始化
!function clearElseInformation() {
  while (majorInformation.nextElementSibling) {
    all.removeChild(majorInformation.nextElementSibling)
  }
}()

function baseInformation() {
  axios({
    url: 'http://127.0.0.1:8080/Information',
    params: {
      id: '22053105'
    }
  }).then(result => {
    // 获取后端结果集
    const resultInformation = result.data.data
    if (!resultInformation) {
      return
    }
    // 填充信息
    idNumber[0].innerHTML = idNumber[1].innerHTML = resultInformation.id
    nameInformation[0].innerHTML = nameInformation[1].innerHTML = resultInformation.name
    birthday.innerHTML = resultInformation.birthday
    gender.innerHTML = resultInformation.gender === '0' ? '女' : '男'
    idCard.innerHTML = resultInformation.idCard
    email.innerHTML = resultInformation.email
    locationName.innerHTML = resultInformation.location
  })
}

baseInformation()   //默认展示基本信息

// 切换页面
chooseParent.addEventListener('click', (e) => {
  const element = e.target
  if (element.classList.contains('chooseParent')) {
    return
  }
  all.removeChild(allChoose.nextElementSibling)
  document.querySelector('.borderChoose').classList.remove('borderChoose')
  element.classList.add('borderChoose')
  if (element.classList.contains('majorInformationChoose')) {
    all.appendChild(majorInformation)
  } else if (element.classList.contains('studyInformationChoose')) {
    all.appendChild(studyInformation)
  } else {
    all.appendChild(elseInformation)
  }
})